<html>
  <head>
    <title>Editor</title>
    <link rel="stylesheet" type="text/css" media="screen" href="stylesheets/game.css">
    <link rel="stylesheet" type="text/css" media="screen" href="stylesheets/editor.css">
    <script src="vendor/underscore-min.js"></script>
    <script src="vendor/jquery-1.7.1.min.js"></script>
    <script src="vendor/jquery.lightbox_me.js"></script>
    <script data-main="editor/editor" src="vendor/require.js"></script>
  </head>
  <body>
    <div id="top">
      <ul id="controls">
	<li>
	<input type="checkbox" id="show-grid-checkbox"/>
	  <label for="show-grid-checkbox">Show Grid</label>
	</li>
	<li>
	  <input type="checkbox" id="flip-checkbox"/>
	  <label for="flip-checkbox">Filp Tile</label>
	</li>
	<li>
	  <label for="rotate-control">Rotate:</label>
	  <select id="rotate-control">
	    <option value="0">0</option>
	    <option value="1">90</option>
	    <option value="2">180</option>
	    <option value="3">270</option>
	  </select>
	</li>
	<li>
          <input type="button" id="new-building-button" value="New Building"/>
	</li>
	<li>
          <input type="button" id="add-entrance-button" value="Add Entrance" disabled="disabled"/>
	</li>
	<li id="coord-display">
          (<span id="x-coord">0</span>, <span id="y-coord">0</span>)
	</li>
	<li id="tile-number-display"></li>
	<li>
	  <input type="button" id="load-button" value="Load"/>
	  <input type="button" id="save-button" value="Save"/>
	</li>
      </ul>
      <div id="progress"><div id="progress-slider"></div></div>
    </div>
    <div id="left">
      <div id="tile-list">
      </div>
      <select id="archetype-list" size="10">
      </select>
    </div>
    <div id="right">
      <div id="map-mask">
        <div id="map">
          <canvas id="map-canvas" width="3840", height="3840">
          </canvas>
        </div>
      </div>
    </div>
    <ul id="sprite-list">
    </ul>
    <div id="load">
      <input type="file" id="load-file"/>
      <!-- <input type="button" id="load-file-button" value="Load" class="close"/> -->
    </div>
    <div id="save">
      <textarea id="save-text" readonly></textarea>
    </div>
    <div id="new-building">
      <h3>Building Name:</h3>
      <input type="text" id="new-building-name" value=""/>
      <input type="button" id="new-building-ok" value="OK"/>
    </div>
  </body>
</html>
